<template>
  <!-- 头寸维护录入页面 -->
  <div class="app-container" style="overflow:scroll">
    <div style="width: 1024px;margin: 20px auto">
      <el-form ref="settingsForm" :model="formData" :rules="rules" label-width="150px">
        <el-row v-if="!isShow">
          <el-col :span="24">
            <el-form-item label="交易流水号：" prop="rspId">
              <el-input v-model="formData.rspId" placeholder="交易流水号" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="当前存款准备金余额：" prop="reserve">
              <el-input v-model="formData.reserve" placeholder="当前存款准备金余额" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="当前预留头寸：" prop="reserveposition">
              <el-input v-model="formData.reserveposition" placeholder="当前预留头寸" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="设置存款准备金余额：" prop="newreserve">
              <ht-amount-input v-model="formData.newreserve" placeholder="设置存款准备金余额" :disabled="!isShow"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设置预留头寸：" prop="newposition">
              <ht-amount-input v-model="formData.newposition" placeholder="设置预留头寸" :disabled="!isShow"/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="bottom-control">
        <el-button type="primary" @click="submitForm" v-if="isShow" :loading="isLoading">提交</el-button>
        <el-button type="warning" @click="reset">重置</el-button>
      </div>
    </div>
  </div>
</template>
<script>
import { detail, save } from "@/api/cnaps/bizMng/position.js";
import { log } from "util";
import { getBankInfByBankCode } from "@/api/cnaps/common/bankInfo";
import { listPageMixin } from "@/libs/listPageMixin";
import { mapGetters } from "vuex";
import HtAmountInput from "@/views/components/HtAmountInput";
export default {
  name: "balanceManageEntry",
  mixins: [listPageMixin],
  components: { HtAmountInput },
  data() {
    return {
      isShow: true,
      //数据字典
      searchFormDictList: [],
      isLoading: false,
      formData: {
        rspId: "",
        newreserve:"",
        newposition:"",
      },
      rules: {
        newreserve: [
          {
            required: true,
            trigger: "change",
            message: "必填",
          },
        ],
        newposition: [
          {
            required: true,
            message: "必填",
            trigger: "change",
          },
        ],
      },
    };
  },
  mounted() {
    this.initData();
  },
  computed: {
    ...mapGetters(["globalBusData"]),
  },
  watch: {
    // globalBusData: {
    //   handler(val) {
    //   },
    //   deep: true,
    //   immediate: true,
    // },
  },
  methods: {
    initData() {
      detail().then(res => {
        this.$set(this.formData, "reserve", res.result.reserve);
        this.$set(this.formData, "reserveposition", res.result.reserveposition);
      });
    },
    // 表单重置
    reset() {
      this.resetForm("settingsForm");
      this.initData();
      this.isShow = true;
    },
    submitForm() {
      this.$refs["settingsForm"].validate(valid => {
        if (valid) {
          this.isLoading = true;
          save(this.formData)
            .then(res => {
              this.msgSuccess("提交成功！");
              this.$set(this.formData, "rspId", res.result.rspId);
              this.isLoading = false;
              this.isShow = false;
            })
            .catch(err => {
              this.isLoading = false;
            });
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.bottom-control {
  margin: 30px 0;
  text-align: center;
}
.label-header-msg {
  font-weight: bold;
}

.form-card {
  margin-bottom: 10px;
}
</style>
